<template>
  <router-view v-slot="{ Component }">
    <keep-alive>
      <component :is="Component" />
    </keep-alive>
  </router-view>

  <van-tabbar v-model="active" :active-color="baseColor">
    <van-tabbar-item to="/">
      <span>首页</span>
      <template #icon="props">
        <span class="iconfont iconshouye"></span>
      </template>
    </van-tabbar-item>

    <van-tabbar-item icon="search" to="/cate">分类</van-tabbar-item>
    <van-tabbar-item icon="friends-o" to="/cart">购物车</van-tabbar-item>
    <van-tabbar-item icon="setting-o" to="/my">我的</van-tabbar-item>
  </van-tabbar>
</template>

<script setup>
import { ref, watch } from "vue";
import { useRoute } from "vue-router";

const route = useRoute();

const active = ref(route.meta.index);
</script>

<script>
export default {
  name: "indexView",
};
</script>
